<template>
  <div>
    <Tabs v-model="currentName">
      <TabPane label="重箱入场" name="1,2">
      </TabPane>
      <TabPane label="重箱出场" name="1,1">
      </TabPane>
      <TabPane label="空箱返场" name="0,2">
      </TabPane>
      <TabPane label="空箱出场" name="0,1">
      </TabPane>
    </Tabs>
    <tablePage ref="containerTab" :api="getContainerInfo" :param="tabParam">
      <template slot-scope="props">
        <Table :columns="containerColumn" :data="props.data"></Table>
      </template>
    </tablePage>
  </div>
</template>
<script>
  import tablePage from '@components/table/tablePage.vue'
  import { getContainerInfo } from '@api/backEnd/station'
  import moment from 'moment'

  export default {
    name: '',
    data () {
      let currentName = '0,2'
      let tabParam = {
        haveyOrEmpty: 1,
        inOrOut: 1,
        trainOrTruck: 0,
        startTime: moment().format('YYYY-MM-DD') + ' 00:00:00',
        endTime: moment().format('YYYY-MM-DD') + ' 23:59:59'
      }
      let localCityId = []
      let containerColumn = [
        {
          title: '车号',
          key: 'truck_no',
          width: 155,
          align: 'center'
        },
        {
          title: '车队名称',
          ellipsis: true,
          align: 'center',
          key: 'fleet_name'
        },
        {
          title: '司机名称',
          ellipsis: true,
          align: 'center',
          key: 'driver_name'
        },
        {
          title: '车型',
          align: 'center',
          key: 'truck_type'
        },
        {
          title: '集装箱号',
          ellipsis: true,
          align: 'center',
          key: 'container_no'
        }
      ]
      let datas = { currentName, localCityId, tabParam, containerColumn, getContainerInfo }
      return datas
    },
    props: {
      // 城市列表
      cityList: {
        type: Array,
        default () {
          return []
        }
      }
    },
    watch: {
      currentName (newVal) {
        if (newVal) {
          let condiArray = newVal.split(',')
          this.tabParam = Object.assign(this.tabParam, { haveyOrEmpty: condiArray[0], inOrOut: condiArray[1] })
          this.$refs['containerTab'].dataRefresh()
        }
      }
    },
    methods: {},
    components: { tablePage }
  }
</script>
<style scoped>
  .lh-32 {
    line-height: 32px;
    margin-right: 5px;
  }
</style>
